<template>
  <div>
    <!-- 顶部栏 -->

    <router-view v-slot="{ Component, route }">
      <transition :name="route.meta.transition">
        <component :is="Component" />
      </transition>
    </router-view>

    <!-- <keep-alive>
			<router-view></router-view>			
    </keep-alive>-->
    <!-- 导航栏 -->
    <div class="home">
      <tabbar></tabbar>
    </div>
  </div>
</template>

<script>
import Tabbar from '../comon/tabbar.vue'
export default {
  components: {
    Tabbar,
  },
}
</script>

<style scoped>
.home {
  height: 1.25rem;
  width: 100%;
  position: fixed;
  bottom: 0px;
  left: 0;
  display: flex;
  flex-direction: row;
  border-top: #dddddd 1px solid;
  background: #ffffff;
  z-index: 9999;
  margin-top: 35px;
}

.home > a {
  height: 100%;
  font-size: 0.875rem;
  width: 33.33%;
  text-align: center;
  font-size: 15px;
  /* line-height: 50px; */
  display: flex;
  flex-direction: column;
}
img {
  width: 0.625rem;
  height: 0.625rem;
}
</style>